Vue.directive('square', function (el, binding) { // update function
  el.innerHTML = Math.pow(binding.value, 2);
});

Vue.directive('my-directive', {
  bind: function () {
    // do the preparation work on element binding
  },
  update: function (newValue, oldValue) {
    // do something based on the updated value
  },
  unbind: function () {
    // do the clean-up work
  }
});

new Vue({
  el: '#app',
  data: { item: 42 }
});
